@prefix-formItem: ~'@{nameSpace}-formItem';

.@{prefix-formItem} {
  display: grid;

  .@{prefix-formItem}-label {
    width: 100%;
    padding-right: 16px;
    .flex();
    .align-center();
  }

  .@{prefix-formItem}-label-text {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .@{prefix-formItem}-message {
    color: var(--design-neutral-color-2);
    font-weight: 200;
    font-size: var(--design-font-size-sm);
  }

  .@{prefix-formItem}-message-row-column {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
  }

  .@{prefix-formItem}-message-success {
    color: var(--design-success-color);
  }

  .@{prefix-formItem}-message-warning {
    color: var(--design-warning-color);
  }

  .@{prefix-formItem}-message-error {
    color: var(--design-error-color);
  }
}